<template>
  <el-date-picker
    v-model="date"
    :type="type"
    class="datePicker"
    :placeholder="placeholder"
    :format="format"
    :disabled="disabled"
    :clearable="clearable"
    :picker-options="pickerOptions"
    :value-format="valueFormat"
    @change="change"
  >
  </el-date-picker>
</template>
<script>
export default {
  name: 'AdatePicker',
  props: {
    value: {
      default: null,
    },
    type: {
      type: String,
      default: 'date',
    },
    format: {
      type: String,
      default: 'yyyy-MM-dd',
    },
    valueFormat: {
      type: String,
      default: 'yyyy-MM-dd',
    },
    disabled: {
      type: Boolean,
      default: false,
    },

    placeholder: {
      type: String,
      default: '选择日期',
    },
    clearable: {
      type: Boolean,
      default: true,
    },
    pickerOptions: {
      default: null,
    },
  },
  data() {
    return {
      date: null,
      dialogVisible: false,
      addData: {},
    };
  },
  watch: {
    value: {
      handler(val) {
        this.date = val;
      },
    },
  },
  methods: {
    change(val) {
      this.$emit('input', val);
      this.$emit('change', val);
    },
  },
};
</script>
<style lang="scss" scoped>
.datePicker {
  width: 100%;
}
</style>
